import React, { Component } from 'react'

export default class EditPerson extends Component {
    state = {
        username:localStorage.getItem('username'),
        age:localStorage.getItem('age')===undefined?localStorage.getItem('age'):'',
        isIpt:false
    }
    render() {
        let {username,age,isIpt} = this.state;
        return (
            <div>
                {!isIpt && <button onClick={() => {
                    this.setState({
                        isIpt:true
                    })
                }}>编辑</button>}
                <div>
                    用户名：{isIpt ? <input type="text" value={username} name="username"/> : username}
                </div>
                <div>
                    年龄：{isIpt ? <input type="text" value={age} name="age"></input> :age}
                </div>
                <button onClick={this.save}>保存</button>
            </div>
        )
    }

     //受控表单
     change = (e) => {
        this.setState({
            [e.target.name]:e.target.value
        })
    }

    save = ()=>{
        //调修改个人信息的接口
        
    }
}
